.TUI-message-input-container {
	width: 100%;
	background-color: #F6F6F6;
	position: fixed;
	left: 0;
	z-index: 99;
	bottom: 0;
	padding-bottom: constant(safe-area-inset-bottom);
	padding-bottom: env(safe-area-inset-bottom);
}

.TUI-message-input {
	padding: 20rpx;
	background-color: #F6F6F6;
	width: 100%;
	box-sizing: border-box;
	min-height: 100rpx;
}

.TUI-message-input-flex {
	display: flex;
	align-items: center;
	justify-content: space-between;
	transition: all 0.3s ease-in-out;
}

.input_left {
	display: flex;
	justify-content: center;
}

.TUI-icon {
	width: 56rpx;
	height: 56rpx;
	display: block;
}

.input_right {
	display: flex;
	justify-content: center;
}

.TUI-message-input-functions {
	display: flex;
}

.TUI-message-input-main {
	width: 500rpx;
	background-color: #fff;
	box-sizing: border-box;
	font-size: 30rpx;
	border-radius: 8rpx;
}

.TUI-message-input-area {
	border-radius: 8rpx;
	font-size: 30rpx;
	box-sizing: border-box;
}

textarea {
	width: 100%;
	/* 固定内边距 */
	padding: 18rpx 15rpx;
	box-sizing: border-box;
	font-size: 28rpx;
	border: none;
	resize: none;
	outline: none;
	background: transparent;
	transition: height 0.2s ease;
}

/* 语音区域样式调整 */
.texts {
	/* 总高度与textarea保持一致 (60rpx内容 + 15*2内边距 = 90rpx) */
	height: 68rpx;
	text-align: center;
	line-height: 68rpx;
	/* 与内容高度一致 */
	font-size: 28rpx;
	box-sizing: border-box;
	/* 确保内边距计算在总高度内 */
}



.quote {
	box-sizing: border-box;
	padding: 10rpx 15rpx;
	width: 500rpx;
	margin-top: 8rpx;
	border-radius: 10rpx;
	background-color: #eaeaea;
	color: #686868;
	margin-left: 70rpx;
	display: flex;
	align-items: center;
	font-size: 28rpx;
}

.quote-row {
	flex: 1;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2; //几行就填几
	-webkit-box-orient: vertical;
	word-break: break-all;
}

.quote-icon {
	width: 40rpx;
	height: 40rpx;
}

.TUI-commom-function {
	display: flex;
	flex-wrap: nowrap;
	width: 750rpx;
	height: 106rpx;
	background-color: #F1F1F1;
	align-items: center;
}

.TUI-commom-function-item {
	display: flex;
	width: 136rpx;
	justify-content: center;
	align-items: center;
	font-size: 24rpx;
	color: #FFFFFF;
	height: 48rpx;
	margin-left: 16rpx;
	border-radius: 24rpx;
	background-color: #00C8DC;
}

.TUI-commom-function-item:first-child {
	margin-left: 48rpx;
}

.TUI-Extensions {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	height: 450rpx;
	padding: 25rpx 30rpx;
	box-sizing: border-box;
	justify-content: space-between;
	/* border-top: 1px solid #666666; */
}

.TUI-Extension-slot {
	width: 128rpx;
	height: 170rpx;
}

.TUI-Extension-icon {
	width: 128rpx;
	height: 128rpx;
	border-radius: 20rpx;
}

.input-placeholder {
	font-size: 28rpx;
	color: #666;
}

.TUI-sendMessage-btn {
	display: flex;
	align-items: center;
	font-size: 26rpx;
}


.TUI-Emoji-area {
	width: 100vw;
	height: 560rpx;
	background-color: #ECECEC;
}
.TUI-Emoji-area .active {
}

.TUI-Extension-slot-name {
	line-height: 34rpx;
	font-size: 24rpx;
	color: #333333;
	letter-spacing: 0;
	text-align: center;
}

.record-modal {
	height: 300rpx;
	width: 60vw;
	background-color: #000;
	opacity: 0.8;
	position: fixed;
	top: 670rpx;
	z-index: 9999;
	left: 20vw;
	border-radius: 24rpx;
	display: flex;
	flex-direction: column;
}

.record-modal .wrapper {
	display: flex;
	height: 200rpx;
	box-sizing: border-box;
	padding: 10vw;
}

.record-modal .wrapper .modal-loading {
	opacity: 1;
	width: 40rpx;
	height: 16rpx;
	border-radius: 4rpx;
	background-color: #006fff;
	animation: loading 2s cubic-bezier(0.17, 0.37, 0.43, 0.67) infinite;
}

.modal-title {
	text-align: center;
	color: #fff;
}

@keyframes loading {
	0% {
		transform: translate(0, 0)
	}

	50% {
		transform: translate(30vw, 0);
		background-color: #f5634a;
		width: 40px;
	}

	100% {
		transform: translate(0, 0);
	}
}